<template>
	<view class="todo-list">
		<view class="todo-task-list" style="width: 90%;">
			<view class="simple-card todo-list-card">
				<view class="simple-header" style="width: 100%">
					<view class="simple-title" style="width: 100%">
						<view class="simple-status" style="min-width: 3.75rem">
							<u-tag :text="obj.statusName" color="#fff" border-color="rgb(30,233,181)" size="mini"
								bg-color="rgb(30,233,181)">
							</u-tag>
						</view>
						<view class="simple-title-text">
							<span>{{ obj.modelName }}</span>
						</view>
					</view>
				</view>
				<view class="simple-card-content" style="margin-top: 20rpx;">巡检人：{{ obj.executorUserNames }}</view>
				<view class="simple-card-content" style="margin-top: 20rpx;">巡检开始时间：{{ obj.startTime }}</view>
				<view class="simple-card-content" style="margin-top: 20rpx;">创建人：{{ creator.nickName }}</view>
				<view class="simple-card-content" style="margin-top: 20rpx;">创建时间：{{ obj.createTime }}</view>
			</view>
		</view>
		<view class="todo-task-list" style="width: 90%;margin-top: 50rpx;">
			<view class="simple-card todo-list-card" v-for="(item,index) in nodeInstanceList" :key="index"
				style="padding: 10rpx;" @click="getCmdb(item)">
				<view class="simple-header" style="width: 100%">
					<view class="simple-title" style="width: 100%">
						<view class="simple-status">
							<u-tag :text="index + 1" color="#fff" border-color="rgb(30,233,181)" size="mini"
								bg-color="rgb(30,233,181)">
							</u-tag>
						</view>
						<view class="simple-title-text">
							<span>{{ item.nodeName }}</span>
						</view>
					</view>
				</view>
				<view class="simple-card-content" style="margin-top: 20rpx;">
					地点：{{ item.siteName ? item.siteName : '' }}</view>
				<view class="simple-card-content" style="margin-top: 20rpx;">对象：{{ item.deviceName }}</view>
			</view>
		</view>


		<view style="width: 90%;margin-top: 20rpx;margin-bottom: 20rpx;">
			<u-button type="primary" @click="startCheck('/offlineInspection/offlineInstance/finishInstance/')"
				v-if="obj.statusName == '进行中' || obj.statusName == '待完成'">巡检完成</u-button>
			<u-button type="primary" @click="startCheckStart('/offlineInspection/offlineInstance/startInstance/')"
				v-if="obj.statusName == '待开始'">巡检开始</u-button>
			<u-button type="primary" @click="startCheckStart('/offlineInspection/offlineInstance/receiveInstance/')"
				v-if="obj.statusName == '待认领'">巡检开始</u-button>
			<u-button type="primary" @click="startCheck('/offlineInspection/offlineInstance/handoverInstance/')"
				v-if="obj.statusName == '可交接'">交接</u-button>
		</view>

		<view style="width: 90%;margin-top: 50rpx;margin-bottom: 20rpx;display: flex;justify-content: space-between;"
			v-if="obj.statusName == '进行中'">
			<u-button type="primary" @click="scanCode">资产扫码</u-button>
			<!-- <u-button type="warning" @click="lookpy">盘盈记录</u-button> -->
			<u-button type="success" @click="endCheck">盘点完成</u-button>
		</view>


		<u-popup v-model="showScreen" mode="bottom" height="900rpx" :safe-area-inset-bottom="true" border-radius="10"
			@close="closeAll">
			<view style="padding: 20rpx;position: relative;">
				<u-form :model="screeningForm" ref="uForm" label-width="150" style="height:600rpx" label-position="top">
					<u-form-item label="盘点类型">
						<u-input v-model="typeName" type="select" placeholder="请选择工单类型"
							@click="typeShow = true" /></u-form-item>
					<u-select v-model="typeShow" :list="options1" valueName="value" labelName="label"
						@confirm="workTypeChange"></u-select>
					<u-form-item label="地址"><u-input v-model="siteName" type="select"
							placeholder="请选择资产类型" /></u-form-item>
					<selelctAddress v-model="showPopupOfHandleUserNameCascades" @city-change="cityChange">
					</selelctAddress>
				</u-form>

				<view style="margin-top: 90rpx;">
					<u-button type="primary" shape="circle" @click="onQuery">搜索</u-button>
				</view>
			</view>
		</u-popup>

		<u-modal v-model="showCheck" :content="content" :show-cancel-button="true" @confirm="confirm"
			@cancel="cancel"></u-modal>

		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import selelctAddress from '../../components/selelctAddress'
	import {
		taskTypeColor,
		taskTypeOptions,
		plan
	} from "../../constants/taskConstant";
	export default {
		components: {
			selelctAddress
		},
		data() {
			return {
				content: "完成盘点",
				showCheck: false,
				screeningForm: {},
				creator: {},
				showPopupOfHandleUserNameCascades: false,
				typeShow: false,
				showScreen: false,
				name: "",
				typeName: "",
				cmdbtype: "",
				siteId: "",
				siteName: "",
				typeId: "",
				type: "0",
				options1: [{
						label: '未盘点',
						value: 0,
					},
					{
						label: '已盘点',
						value: 1,
					}
				],
				options2: [{
						label: '安全层',
						value: 1,
					},
					{
						label: '物理层',
						value: 2,
					},
				],
				list: [],
				obj: {},
				id: "",
				taskTodoList: [],
				workOrderTodoList: [],
				todoType: " 任务",
				taskTypeColor: [],
				plan: [],
				taskTypeOptions: [],
				nodeInstanceList: [],
			}
		},
		onLoad(val) {
			this.id = val.id
			this.getList()
		},
		mounted() {
			this.taskTypeColor = taskTypeColor;
			this.taskTypeOptions = taskTypeOptions;
			this.plan = plan
		},
		methods: {
			getList() {
				this.$request('', '/offlineInspection/offlineInstance/selectNodeInfos?instanceId=' + this.id + '&getXml=' +
						this.type, 'get', {}, {}, )
					.then(res => {
						console.log(res.data)
						this.creator = res.data.creator;
						this.nodeInstanceList = res.data.nodeInstanceList
						this.obj = res.data;
					})
			},
			lookpy() {
				uni.navigateTo({
					url: '/pages/Inventory/list?id=' + this.id
				})
			},
			closeAll() {
				this.showPopupOfHandleUserNameCascades = false
				this.typeShow = false
				this.showScreen = false
				this.showPopupOfHandleUserNameCascades = false
				this.typeShow = false
				this.showScreen = false
				this.name = ""
				this.typeName = ""
				this.cmdbtype = ""
				this.siteId = ""
				this.siteName = ""
				this.typeId = ""
				this.type = "0"
			},
			// 盘点类型
			changeType(val) {
				this.$request('', '/offlineInspection/check/plan/info/' + this.id + '?status=' + this.type,
						'get', {}, {}, )
					.then(
						res => {
							const {
								data
							} = res;
							// console.log(rows)
							this.list = data;
						})
			},
			// 名字搜索
			onQuery() {
				this.$request('', '/offlineInspection/check/plan/info/' + this.id + '?status=' + this.type + '&name=' +
					this
					.name + '&siteId=' + this.siteId + "&typeId=" + this.typeId, 'get', {}, {}, ).then(
					res => {
						const {
							data
						} = res;
						// console.log(rows)
						this.list = data;
						this.closeAll()
					})
			},
			// 获取详情
			getPlanDateil() {
				this.$request('', '/offlineInspection/check/plan/checkInfo/' + this.id, 'get', {}, {}, ).then(
					res => {
						const {
							data
						} = res;
						// console.log(rows)
						this.obj = data;
					})
			},
			workTypeChange(val) {
				console.log(val)
				this.typeName = val[0].label
				this.type = val[0].value
			},
			// 地址选择
			cityChange(val) {
				console.log(val)
				this.siteName = val.province.siteName + '/' + val.city.siteName
				this.siteId = val.city.id
			},
			scanCode() {
				var that = this
				// var cmdbId = "095159d2-956b-4370-8377-74f96cdbcced"
				// console.log(cmdbId)
				// console.log(that.id)
				// uni.navigateTo({
				// 	url: '/pages/Inventory/cmdbDetail?checkId=' + "577d7c84eaae4ea48e97164a16bb639c" + '&id=' +
				// 		cmdbId
				// })
				uni.scanCode({
					onlyFromCamera: true,
					autoZoom: false,
					scanType: ['qrCode'],
					success: function(res) {
						that.$refs.uToast.show({
							title: '扫码成功',
							type: 'success'
						})
						var cmdbId = JSON.parse(res.result).objectId;
						uni.navigateTo({
							url: '/pages/Inventory/cmdbDetail?checkId=' + that.id + '&id=' + cmdbId
						})
					}
				});


			},
			startCheck(url) {
				this.$request('', url + '?instanceId=' + this.obj.instanceId, 'post', {}, {}, )
					.then(res => {
							this.$refs.uToast.show({
								title: '巡检结束',
								type: 'success'
							})
							this.showCheck = false
							uni.switchTab({
								url: '/pages/site/index'
							})
						})
			},
			startCheckStart(url) {
				this.$request('', url + '?instanceId=' + this.obj.instanceId, 'post', {}, {}, )
					.then(res => {
							this.$refs.uToast.show({
								title: '巡检开始',
								type: 'success'
							})
							this.showCheck = false
							this.getList()
						})
			},
			confirm() {
				this.$request('', '/offlineInspection/check/plan/finishCheckPlan?checkId=' + this.obj.id, 'post', {}, {}, )
					.then(res => {
							this.$refs.uToast.show({
								title: '盘点结束',
								type: 'success'
							})
							this.showCheck = false
							uni.switchTab({
								url: '/pages/Inventory/index'
							})
						})
			},
			cancel() {
				this.showCheck = false
			},
			endCheck() {
				this.showCheck = true
			},
			// 查看盘点资产详情
			getCmdb(val) {
				uni.navigateTo({
					url: '/pages/site/task?id=' + val.id
				})
			},
			/**
			 * 处理时间
			 */
			parseTime(time, pattern) {
				if (arguments.length === 0 || !time) {
					return null;
				}
				const format = pattern || "{y}-{m}-{d} {h}:{i}:{s}";
				let date;
				if (typeof time === "object") {
					date = time;
				} else {
					if (typeof time === "string" && /^[0-9]+$/.test(time)) {
						time = parseInt(time);
					} else if (typeof time === "string") {
						time = time
							.replace(new RegExp(/-/gm), "/")
							.replace("T", " ")
							.replace(new RegExp(/\.[\d]{3}/gm), "");
					}
					if (typeof time === "number" && time.toString().length === 10) {
						time = time * 1000;
					}
					date = new Date(time);
				}
				const formatObj = {
					y: date.getFullYear(),
					m: date.getMonth() + 1,
					d: date.getDate(),
					h: date.getHours(),
					i: date.getMinutes(),
					s: date.getSeconds(),
					a: date.getDay(),
				};
				const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
					let value = formatObj[key];
					// Note: getDay() returns 0 on Sunday
					if (key === "a") {
						return ["日", "一", "二", "三", "四", "五", "六"][value];
					}
					if (result.length > 0 && value < 10) {
						value = "0" + value;
					}
					return value || 0;
				});
				return time_str;
			}
		}
	}
</script>

<style lang="scss">
	.todo-list {
		overflow: scroll;
		background-color: #fff;
		height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		flex-direction: column;

		.todo-list-card {
			+.todo-list-card {
				margin-top: 10rpx;
			}

			.simple-card-content {
				color: #aaaaaa;
			}
		}

		.card-list {
			border: 1px solid #ccc;
		}
	}

	.work-style {
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: center;
		margin-top: 30rpx;
	}
</style>